<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>组件注册</title>
</head>
<body>
<div id="app">


    <com1></com1>
    <com2></com2>
    <com3></com3>
</div>

</body>
<script src="../../../lib/vue.global.js"></script>
<script>


    const com1 = {
        template: '<div>组件1</div>'
    }


    const com2 = {
        template: '<div>组件2</div>'
    }


    const com3 = {
        template: '<div>组件3</div>'
    }


    const createApp = Vue.createApp;

    /**
     * 1. 局部注册
     * */
    // createApp({
    //     components:{
    //         com1,
    //         zuJian:com2,
    //         com3
    //     }
    // }).mount('#app')

    /**
     * 2.全局注册
     *    vue-cli
     *       spa ： single page application
     *           index.html  app.vue  main.js --- vue instance
     * */

    createApp({}) // maim.js中的唯一实例上 注册
        .component('com1', com1)
        .component('com2', com2)
        .mount('#app')


</script>
</html>